doctype html
html(lang="en")
    head
        meta(charset="utf-8")
        meta(name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no")
        title Leela Zero Server

        link(rel="stylesheet" href="https://unpkg.com/vuetify@1.0.18/dist/vuetify.min.css" crossorigin="anonymous")
        link(rel="stylesheet" href='https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Material+Icons' crossorigin="anonymous")

        block meta
    body
        main.container
            v-app
                v-toolbar(app dark)
                    v-toolbar-title Leela Zero
                    v-toolbar-items
                        v-btn(flat href="/home") Home
                        v-btn(flat href="/matches") Matches
                        v-btn(flat href="/network-profiles") Networks
                        v-btn(flat href="/opening") Opening
                    v-spacer
                    v-toolbar-items
                        v-btn(flat href="https://github.com/gcp/leela-zero") Github
                        v-btn(flat href="https://github.com/gcp/leela-zero/releases") Releases
                        v-btn(flat href="https://github.com/gcp/leela-zero/blob/master/FAQ.md") FAQ
                        v-btn(flat href="https://github.com/gcp/leela-zero/blob/master/README.md") README
                v-content
                    block content

        script(src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous")
        script(src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.min.js" crossorigin="anonymous")
        script(src="https://unpkg.com/vuetify@1.0.18/dist/vuetify.min.js" crossorigin="anonymous")
        script.
            function nFormatter(num, digits) {
                var si = [
                    { value: 1, symbol: "" },
                    { value: 1E3, symbol: "K" },
                    { value: 1E6, symbol: "M" },
                    { value: 1E9, symbol: "G" },
                    { value: 1E12, symbol: "T" },
                    { value: 1E15, symbol: "P" },
                    { value: 1E18, symbol: "E" }
                ];
                var rx = /\.0+$|(\.[0-9]*[1-9])0+$/;
                var i;
                for (i = si.length - 1; i > 0; i--) {
                    if (num >= si[i].value) {
                    break;
                    }
                }
                return (num / si[i].value).toFixed(digits).replace(rx, "$1") + si[i].symbol;
            }
            Vue.filter('timeAgo', function(value) {
                var epoch = +value, delta = Date.now() - epoch;

                if(delta > 60 * 60 * 24 * 1000) {
                    let date = new Date(epoch);
                    return date.toLocaleDateString() + " " + date.toLocaleTimeString();
                } else {
                    return deltaToAgo(delta);
                }
            })
            Vue.filter('abbr', nFormatter)
        block script
